<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<title></title>
		<link rel="stylesheet" type="text/css" href="../../css/api.css" />
		<link rel="stylesheet" type="text/css" href="../../css/style.css" />
		<link rel="stylesheet" type="text/css" href="../../css/btnplus.css" />
		<style type="text/css">
			html,body{
				background-color: #F7F8FA;
				
			}
			.order_list{ padding: 10px 15px;}
			.order_list li{ margin-bottom: 10px; background-color: #fff; padding: 0 10px; border-radius: 4px; overflow: hidden;}
			.order_list .title{ position:relative; height: 40px; line-height: 40px; font-size: 13px; color: #999;}
			.order_list .title::after{ position:absolute; content: ""; left: 0; right: 0; bottom: 0; border-bottom: 1px #d4d4d4 solid; transform: scaleY(0.5);}
			.order_list .title p{ float:left;}
			.order_list .title i{ float: right; color: #1c63fa; font-size: 12px;}
			.order_list .con{ padding: 5px 0 10px;}
			.order_list .con h4{ display:block; font-size: 18px; font-weight: 500; color: #333; line-height: 35px;}
			.order_list .con p{ font-size: 14px; color: #5D5D5D; line-height: 18px;white-space: nowrap;text-overflow: ellipsis; overflow: hidden;}
			.order_list .con i{ float: left; border-radius: 2px; margin-right: 12px; line-height: 16px; font-size: 12px; padding: 0 6px;}
			.order_list .con img{ display:inline-block; vertical-align: top; height: 5px; margin: 14px 5px 0;}
			.order_list .con span{ margin-top: 7px; display:block; color: #9F9F9F; font-size: 14px; line-height: 25px; height: 25px; overflow: hidden;}
			.order_list .contact{ position:relative; padding: 10px 0;}
			.order_list .contact::after{ position: absolute; content: ""; left: 0; top: 0; right: 0; border-top: 1px #dbdbdb solid; transform: scaleY(0.5);}
			.order_list .contact .m_cell_hd img{ width: 35px; height: 35px; border-radius: 50%; margin-right: 10px;}
			.order_list .contact b{ display:block; font-size: 12px; color: #333; line-height: 15px;}
			.order_list .contact p{ font-size: 12px; color: #999;}
			.order_list .contact a img{ width: 33px; height: 33px;}
			.s_01{border: 1px #CF4242 solid; color: #CF4242;}
			.s_02{border: 1px #69C8A2 solid; color: #69C8A2;}
			.s_03{border: 1px #3262F1 solid; color: #3262F1;}
			.sk-three-bounce {
			  margin: 0 auto;
			  width: 80px;
			  text-align: center; }
			  .sk-three-bounce .sk-child {
				width: 13.5px;
				height: 13.5px;
				background-color: #3262F1;
				border-radius: 100%;
				display: inline-block;
				-webkit-animation: sk-three-bounce 1.4s ease-in-out 0s infinite both;
						animation: sk-three-bounce 1.4s ease-in-out 0s infinite both; }
			  .sk-three-bounce .sk-bounce1 {
				-webkit-animation-delay: -0.32s;
						animation-delay: -0.32s; }
			  .sk-three-bounce .sk-bounce2 {
				-webkit-animation-delay: -0.16s;
						animation-delay: -0.16s; }

			@-webkit-keyframes sk-three-bounce {
			  0%, 80%, 100% {
				-webkit-transform: scale(0);
						transform: scale(0); }
			  40% {
				-webkit-transform: scale(1);
						transform: scale(1); } }

			@keyframes sk-three-bounce {
			  0%, 80%, 100% {
				-webkit-transform: scale(0);
						transform: scale(0); }
			  40% {
				-webkit-transform: scale(1);
						transform: scale(1); }
			}
			.more{ padding: 1.20rem 0; text-align: center; font-size: 0.26rem; color: #999; line-height: 0.60rem;}
			.display-none{ display:none; }
			.text-center { text-align: center !important; }
		</style>
	</head>
	<body>
		<div id="result" class="display-none">
		<div class="order_list">
			<ul id="goodslist">

			</ul>
			<script id="goodslist_template" type="text/template">
				{{ for (var i = 0, len = it.length; i < len; i++) { }}
				<li tapmode onclick="openNavWin('#ddd','goodsdetail_win','../goods/goodsdetail_frm.html','货源详情',false,false,true,[],{goodsid:{{=it[i].id}},fromfrm:'linegoods'});">
					<div class="con">
						<h4>{{=it[i].sendaddress}} <img src="../../image/img_21.png" alt="" /> {{=it[i].destaddress}}</h4>
						<p class="clearfix"><i class="s_0{{=it[i].loadingdatestatus}}">{{=it[i].loadingdate}}装车</i>{{=it[i].cartype}}/{{=it[i].carlen}}/{{=it[i].weightv}}/{{=it[i].goodstype}}</p>
					</div>
					<div class="contact">
						<div class="m_cell_hd"><img data-echo="{{=it[i].avatar}}" src="../../image/defaultimg.png" onerror="javascript:this.src='../../image/defaultimg.png';" /></div>
						<div class="m_cell_hd m_cell_primary">
							<b>{{=it[i].realname}}</b>
							<p>{{=it[i].createtime}}</p>
						</div>
						<div class="m_cell_ft"><a href="javascript:;" tapmode onclick="checkcall('{{=it[i].mobile}}')"><img src="../../image/img_34.png" alt="" /></a></div>
					</div>
				</li>
				{{ } }}
			</script>
		</div>
		<div class="s_more display-none">没有更多了</div>
		<!--列表end-->
		</div>
		<div class="text-center display-none" style="padding: 60px 0 !important;" id="divnodata">
			<div class="text-center"><img src="../../image/nofound.png" style="margin:0 auto;width:41px;height:auto;"></div>
			<p class="text-center" style="font-size:12px;color:#9f9f9f;margin-top:15px;">暂无货源信息</p>
		</div>
	</body>
	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript" src="../../script/app.js"></script>
	<script type="text/javascript" src="../../script/permission.js"></script>
	<script type="text/javascript" src="../../script/doT.js"></script>
	<script type="text/javascript" src="../../script/echo.js"></script>
	<script type="text/javascript">
		var page = 1;
		var linesid;
		
		function echoInit() {
			echo.init({
					offset : 0,
					throttle : 0 //设置图片延迟加载的时间
			});
		}
		var UILoading;
		apiready = function() {
			api.parseTapmode();
			UILoading = api.require('UILoading');
			linesid = api.pageParam.linesid;
			$api.addCls($api.dom('#result'), 'display-none');
			showloading();
			getJsonFromAPI();
			api.addEventListener({
                name: 'navitembtn'
            }, function(ret, err) {
                if (ret.type == 'left') {
					api.closeWin({
					});
                }
            });
			api.addEventListener({
				name:"scrolltobottom"
			},function(ret,err){
				getJsonFromAPI();
			});
			
			api.addEventListener({
				name : 'refreshgoods'
			}, function(ret, err) {
				refreshPage();
				
			});
			api.addEventListener({
				name : 'refreshgoodlist'
			}, function(ret, err) {
				refreshPage();			
			});
			api.addEventListener({
				name : 'reloadpage'
			}, function(ret, err) {
				refreshPage();				
			});
		}
		function checkcall(tel) {
			api.getPrefs({
				key: 'user_info'
			}, function(ret, err) {
				if (ret.value) {
					var userinfo = JSON.parse(ret.value);
					
					if(userinfo.status!=1){
						tipbox(userinfo.status);
						return;
					}
					if(userinfo.mobile == tel) {
						toast('不能呼叫自己');
						return;
					}
					call(tel);
				}
			});
			event.stopPropagation();
		}
		function call(tel) {
			var pername = 'phone';
			var perdesc = '拨打电话';
			if (api.systemType == "android") {
				if(!confirmPer(pername,perdesc,'')){
					return;
				}
			}
			if(tel != '')
			{
				if(api.systemType == 'ios'){
					api.call({
						type: 'tel_prompt',
						number: tel
					});
				}else{
					api.confirm({
						title: '确认拨打电话吗?',
						msg: tel,
						buttons: ['取消', '呼叫']
					}, function(ret, err) {
						var index = ret.buttonIndex;
						if(index == 2)
						{
							api.call({
								type: 'tel',
								number: tel
							});
						}
					});
				}
			}
			
		}
		function refreshPage() {
			page = 1;
			getJsonFromAPI();
		}
		function getJsonFromAPI() {
			//从接口获取查询数据
			api.getPrefs({
				key: 'user_info'
			}, function(ret, err) {
				if (ret.value) {
					var userinfo = JSON.parse(ret.value);
					console.log(ApiUrl + '/v1/linegoods/'+linesid+'/'+ page);
					api.ajax({
						url: ApiUrl + '/v1/linegoods/'+linesid+'/'+ page,
						method: 'get',
						cache: false,
						timeout: 10,
						headers: {
							authorization: kAppKey+';'+userinfo.access_token+';'+userinfo.uid
						}
					}, function(ret, err) {
						hideloading();
						$api.removeCls($api.byId('result'), 'display-none');
						if (ret) {
							if(ret.list.length > 0)
							{
								$api.addCls($api.byId('divnodata'),'display-none');
								var isAppend = true;
								if(page==1)
								{
									isAppend = false;
								}
								page++;
								var goodslist = ret.list;
								UpdateList('goodslist','goodslist_template',goodslist,isAppend);
							}
							else
							{
								if(page==1)
								{
									UpdateList('goodslist','goodslist_template',ret.list,false);
									$api.removeCls($api.byId('divnodata'),'display-none');
								}
							}
							
						} else {
							if(err.statusCode==402)
							{
								Relogin();
							}
							else
							{
								console.log(JSON.stringify(err));
								toast('网络异常');
							}
						}
					});
				}
			});
		}
		//渲染数据
		function UpdateList(domId,templateId,jsondata,isAppend) {
			//console.log(JSON.stringify(jsondata));
			var act_content = $api.byId(domId);
			var tempFn = doT.template($api.byId(templateId).innerHTML);
			var resultText = tempFn(jsondata);
			//alert(isAppend);
			//console.log(resultText);
			if(isAppend)
			{
				$api.append(act_content, resultText);
			}
			else
			{
				$api.html(act_content, resultText);
			}
			api.parseTapmode();
			setTimeout(function() {
				echoInit();
			}, 300);
		}
	</script>
</html>